import { types, unprotect } from "mobx-state-tree";
import axios from "axios";

export const ProductItem = types
  .model("ProductItem")
  .props({
    prodName: types.string,
    price: types.number,
    discount: types.number,
  })
  .views((self) => ({
    //views 相当于计算属性 前面必须加get
    get priceAfterDiscount() {
      console.log("self", self);
      return self.price - self.discount;
    },
    get fullName() {
      return `${self.prodName} ${self.price}`;
    },
  }))
  .actions((self) => ({
    // 方法
    priceAdd() {
      self.price++;
      console.log(self.price);
    },
    async changeName() {
      try {
        const msg = await axios.get("http://120.27.136.69:3000/pro/test");
        console.log(msg.data.msg);
        self.prodName = msg.data.msg;
      } catch (err) {
        console.log(err);
      }
    },
  }));
// .volatile(self => ({
//   fullName: `${self.prodName} ${self.price}`
// }))

export const productItem = ProductItem.create({
  prodName: "商品标题xxx",
  price: 99.9,
  discount: 10,
  
});

//解除安全模式   可以不用专门写修改props方法修改props值
unprotect(productItem);
